<template>
  <div class="container" style="margin-bottom: 50px">
    <p class="title">
      流程详情
      <el-button
        type="primary"
        class="btn"
        @click="$router.back()"
      >返回</el-button>
    </p>
    <el-form ref="form" label-width="80px" style="width: 80%">
      <el-form-item label="基本信息">
        <label for="">流程编号: </label> <span>{{ info.orderNo }}</span><br>
        <label for="">流程类型: </label>
        <span>{{ ["保障购车", "简易购车"][info.buyWay] }}</span><br>
        <label for="">创建时间: </label><span>{{ info.createTime }}</span><br>
        <label for="">交易类型: </label><span>{{ ["本地购车", "异地购车"][info.transactionType] }}</span><br>
        <label for="" style="color:#00f">流程状态: </label><span style="color:#00f">{{ ["进行中", "已完成", "已关闭"][info.orderStatus] }}</span>
      </el-form-item>
      <el-form-item label="流程进度">
        <el-tabs type="card">
          <el-tab-pane :label="simpleBuyCarConfirm.sellerGiveCarConfirmTime?'购车确认(已完成)':'购车确认(未完成)'">
            <el-collapse>
              <el-collapse-item>
                <template slot="title">
                  <p class="line">
                    <span class="left">
                      买方支付平台服务费用
                      <span
                        v-if="simpleBuyCarConfirm.payPlatformFeeSuccessTime"
                        class="arrow"
                      >
                        √</span>
                    </span>
                    <span>
                      支付成功时间：{{ simpleBuyCarConfirm.payPlatformFeeSuccessTime }}
                    </span>
                    <span />
                  </p>
                </template>
                <p>订单编号 ：{{ simpleBuyCarConfirm.payPlatformFeeOrderNo }} &nbsp;&nbsp; <span v-if="simpleBuyCarConfirm.payPlatformFeeOrderId" style="color:#00f;cursor: pointer;" @click="$router.push(`/orderCenter/details/orderDetail?orderId=${simpleBuyCarConfirm.payPlatformFeeOrderId}&orderType=4`)">查看详情</span> </p>
                <p>创建时间： {{ vehicleOrderPay.createTime }}</p>
              </el-collapse-item>
              <el-collapse-item>
                <template slot="title">
                  <p class="line">
                    <span class="left">
                      买方确认提车信息
                      <span
                        v-if="simpleBuyCarConfirm.buyerPickCarConfirmTime"
                        class="arrow"
                      >
                        √</span>
                    </span>
                    <span>
                      确认完成时间:{{ simpleBuyCarConfirm.buyerPickCarConfirmTime }}
                    </span>
                    <span />
                  </p>
                </template>
                <p>期待交付车辆时间: {{ deliveryInfo.deliveryTimeSimple }} </p>
                <p>车辆成交价格: {{ carInfo.amount }}万 </p>
              </el-collapse-item>
              <el-collapse-item>
                <template slot="title">
                  <p class="line">
                    <span class="left">
                      卖方确认交车信息
                      <span
                        v-if="simpleBuyCarConfirm.sellerGiveCarConfirmTime"
                        class="arrow"
                      >
                        √</span>
                    </span>
                    <span>
                      确认完成时间{{ simpleBuyCarConfirm.sellerGiveCarConfirmTime }}
                    </span>
                    <span />
                  </p>
                </template>
                <el-row :gutter="24">
                  <el-col :span="12">
                    <b>交付信息</b>
                    <p>交付时间：{{ deliveryInfo.deliveryTimeSimple }}</p>
                    <p>交付地点：{{ deliveryInfo.deliveryAddress }}</p>
                  </el-col>
                  <el-col :span="12">
                    <b>买方信息</b>
                    <p>联系人:{{ userInfo.name }}</p>
                    <p>联系电话:{{ userInfo.mobile }}</p>
                    <p>上牌城市:{{ info.spCityName }}</p>
                  </el-col>
                </el-row>

              </el-collapse-item>
            </el-collapse>
          </el-tab-pane>

          <el-tab-pane :label="shopping.buyerPayBuyCarFeeConfirmTime?'购车签约(已完成)':'购车签约(未完成)'">
            <el-collapse>
              <el-collapse-item>
                <template slot="title">
                  <p class="line">
                    <span class="left">
                      卖方设置存管账户
                      <span
                        v-if="shopping.sellerCreateAccountTime"
                        class="arrow"
                      >
                        √</span>
                    </span>
                    <span v-if="shopping.sellerCreateAccountTime">
                      设置完成时间：{{ shopping.sellerCreateAccountTime }}
                    </span>
                    <span v-if="sellAccount && sellAccount.tips">
                      {{ sellAccount.tips }}
                    </span>
                    <span />
                  </p>
                </template>
                <!-- <p v-if="shopping.remark">失败原因：{{ shopping.remark }}</p> -->
                <p>卖方存款账号 : {{ sellAccount.account | filteridCardNo }}</p>
                <p>开户人: {{ sellAccount.name }}</p>
                <p>联系电话: {{ sellAccount.mobile | filterMoblie }}</p>
                <p>身份证:{{ sellAccount.idCard | filterBrandCode }}</p>
                <p>存管银行 : {{ sellAccount.bankName }}</p>
              </el-collapse-item>
              <el-collapse-item>
                <template slot="title">
                  <p class="line">
                    <span class="left">
                      买方设置存管账户
                      <span
                        v-if="shopping.buyerCreateAccountTime"
                        class="arrow"
                      >
                        √</span></span>
                    <span v-if="shopping.buyerCreateAccountTime">
                      设置完成时间：{{
                        shopping.buyerCreateAccountTime
                      }}</span>
                    <span v-if="buyAccount.tips">
                      {{ buyAccount.tips }}
                    </span>
                    <span />
                  </p>
                </template>
                <p>买方存款账号 : {{ buyAccount.account |filterMoblie }}</p>
                <p>开户人: {{ buyAccount.name }}</p>
                <p>联系电话: {{ buyAccount.mobile |filterMoblie }}</p>
                <p>身份证:{{ buyAccount.idCard |filteridCardNo }}</p>
                <p>存管银行 : {{ buyAccount.bankName }}</p>
              </el-collapse-item>
              <p class="line">
                <span class="left">
                  买方做活体实名认证
                  <span
                    v-if="shopping.buyerRealNameAuthFinishedTime"
                    class="arrow"
                  >
                    √</span>
                </span>
                <span style="width: 551px;">
                  认证完成时间：{{ shopping.buyerRealNameAuthFinishedTime }}
                </span>
              </p>
              <el-collapse-item>
                <template slot="title">
                  <p class="line">
                    <span class="left">
                      买方签订交易合同
                      <span
                        v-if="shopping.buyerSignTransactionContractTime"
                        class="arrow"
                      >
                        √</span></span>
                    <span>
                      签订完成时间:
                      {{ shopping.buyerSignTransactionContractTime }}
                    </span>
                    <span />
                  </p>
                </template>
                <p>
                  买方合同:
                  <span
                    v-if="buyViewUrl"
                    style="color:#00f;cursor: pointer;"
                    @click="openUrl(buyViewUrl)"
                  >查看合同</span>
                </p>
              </el-collapse-item>
              <el-collapse-item>
                <template slot="title">
                  <p class="line">
                    <span class="left">
                      卖方签订交易合同
                      <span
                        v-if="shopping.sellerSignTransactionContractTime"
                        class="arrow"
                      >
                        √</span></span>
                    <span>
                      签订完成时间:
                      {{ shopping.sellerSignTransactionContractTime }}
                    </span>
                    <span />
                  </p>
                </template>
                <p>
                  卖方合同:
                  <span
                    v-if="sellViewUrl"
                    style="color:#00f;cursor: pointer;"
                    @click="openUrl(sellViewUrl)"
                  >查看合同</span>
                </p>
              </el-collapse-item>
              <el-collapse-item>
                <template slot="title">
                  <p class="line">
                    <span class="left" style="width: 250px">
                      买方支付车辆定金，合同服务费等费用
                      <span
                        v-if="shopping.buyerPayBuyCarFeeConfirmTime"
                        class="arrow"
                      >
                        √</span>
                    </span>
                    <span>
                      确认时间: {{ shopping.buyerPayBuyCarFeeConfirmTime }}
                    </span>
                    <span />
                  </p>
                </template>
                <b>定金账单</b>
                <p>全款: {{ info.amount }} 元</p>
                <b>存款账户信息</b>
                <p>存款银行: {{ buyAccount.bankName }}</p>
                <p>姓名: {{ buyAccount.name }}</p>
                <p>存款账号: {{ buyAccount.account }}</p>
                <b>到账情况</b>
                <p>
                  存款账号可提现余额:
                  {{ buyAccount.withdrawalBalance || 0 }} 元
                </p>
                <p v-if="info.amount && buyAccount.withdrawalBalance && Number(info.amount-buyAccount.withdrawalBalance).toFixed(2)>0">
                  还需转入金额: {{ Number(info.amount-buyAccount.withdrawalBalance).toFixed(2) }} 元
                </p>
                <p v-else>
                  还需转入金额: &nbsp;&nbsp;0 元
                </p>
              </el-collapse-item>
            </el-collapse>
          </el-tab-pane>
          <el-tab-pane :label="simpleVehicleHandover.buyerSignCarConfirmTime?'车辆签收（已完成）':'车辆签收(未完成)'">
            <el-collapse>
              <el-collapse-item>
                <template slot="title">
                  <p class="line">
                    <span class="left">
                      买方确认签收车辆
                      <span
                        v-if="simpleVehicleHandover.buyerSignCarConfirmTime"
                        class="arrow"
                      >
                        √</span>
                    </span>
                    <span>
                      确认时间：{{ simpleVehicleHandover.buyerSignCarConfirmTime }}
                    </span>
                    <span />
                  </p>
                </template>
                <p>车辆验收照片：</p>
                <p class="box">
                  <img
                    :src="imgSrc"
                    style="    width: 200px;
                    cursor: pointer;
    height: 125px;"
                    @click="open(imgSrc)"
                  >
                  <!-- <img
                    v-for="(item,i) in ListByVehicleAssignedInfoIdType"
                    :key="i"
                    :src="item.url"
                  > -->
                </p>
              </el-collapse-item>
            </el-collapse>
          </el-tab-pane></el-tabs>
      </el-form-item>
      <el-form-item label="车辆信息">
        <label for="">VIN: </label><span style="color:#00f;cursor: pointer;" @click="$router.push(`/carAdmin/saleList?carInfoId=${info.carInfoId}`)">{{ carInfo.vin }}</span> <br>
        <label for="">行驶证: </label><span>
          <img style="width: 120px; height: 50px;cursor: pointer;" :src="carInfo.imgZy" @click="open(carInfo.imgZy)">
        </span>
        <br>
        <label for="">车牌号: </label><span>{{ carInfo.vehicleNo }}</span><br>
        <label for="">使用性质: </label><span>{{
          ["非营运", "营运", "营转非", "租赁", "教练"][carInfo.isUse]
        }}</span><br>
        <label for="">初次上牌日期: </label><span>{{ carInfo.spTime }}</span><br>
        <label for="">品牌车型: </label><span>{{ carInfo.modelName }}</span><br>
        <label for="">上架价格: </label><span>{{ carInfo.amount || 0 }} 万</span><br>
      </el-form-item>
      <el-row>
        <el-col :span="12">
          <el-form-item label="买方信息">
            <label for="">用户ID: </label> <span>{{ userInfo.id }}</span> <br>
            <label for="">用户身份: </label><span>{{ ["普通用户", "经纪人", "车务"][userInfo.roleType] }}</span><br>
            <label for="">联系人: </label><span>{{ userInfo.name }}</span><br>
            <label for="">手机号: </label><span>{{ userInfo.mobile }}</span><br>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="卖方信息">
            <label for="">用户ID: </label> <span>{{ sellerInfo.id }}</span>
            <br>
            <label for="">用户身份: </label><span>{{
              ["普通用户", "经纪人", "车务"][sellerInfo.roleType]
            }}</span><br>
            <label for="">联系人: </label><span>{{ sellerInfo.name }}</span><br>
            <label for="">手机号: </label><span>{{ sellerInfo.mobile }}</span><br>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="买方经纪人信息" label-width="110px">
            <label for="">用户ID: </label>
            <span v-if="userInfo.roleType == 1">{{ userInfo.id }}</span> <br>
            <label for="">用户身份: </label><span v-if="userInfo.roleType == 1">{{
              ["普通用户", "经纪人", "车务"][userInfo.roleType]
            }}</span><br>
            <label for="">联系人: </label><span v-if="userInfo.roleType == 1">{{ userInfo.name }}</span><br>
            <label for="">手机号: </label><span v-if="userInfo.roleType == 1">{{ userInfo.mobile }}</span><br>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="卖方经纪人信息" label-width="110px">
            <label for="">用户ID: </label>
            <span v-if="sellerInfo.roleType == 1">{{ sellerInfo.id }}</span>
            <br>
            <label for="">用户身份: </label><span v-if="sellerInfo.roleType == 1">{{
              ["普通用户", "经纪人", "车务"][sellerInfo.roleType]
            }}</span><br>
            <label for="">联系人: </label><span v-if="sellerInfo.roleType == 1">{{ sellerInfo.name }}</span><br>
            <label for="">手机号: </label><span v-if="sellerInfo.roleType == 1">{{ sellerInfo.mobile }}</span><br>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <el-dialog
      v-dialogDrag
      :visible.sync="dialogVisible"
      width="1300px"
      title="报告详情"
    >
      <div class="scroll">
        <iframe
          border="0"
          frameborder="0"
          marginwidth="0"
          marginheight="0"
          scrolling="yes"
          style="
            width: 1200px;
            height: 800px;
            overflow: scroll;
            overflow-x: hidden;
          "
          :src="url"
        />
      </div>
    </el-dialog>
    <el-dialog
      title="图片"
      :visible.sync="imgDialogVisible"
      width="800px"
    >
      <img :src="imgUrl" style="width:750px">
    </el-dialog>

  </div>
</template>

<script>
// import { getToken } from '@/utils/auth'
export default {
  data() {
    return {
      url: '',
      imgUrl: '',
      imgDialogVisible: false,
      dialogVisible: false,
      info: {
        vehicleOrderId: null, // 车辆订单id
        orderNo: null, // 订单号（流程编号）
        buyWay: null, // "流程类型(购车方式：0 保障购车，1简易购车)
        transactionType: null, // 交易类型,0本地购车，1异地购车
        createTime: null, // 创建时间
        orderStatus: null, // 订单状态：0进行中，1已完成，2已关闭
        buserId: null, // 买方用户ID
        suserId: null // 卖方用户ID
      },
      carInfo: {
        id: 90000, // 车辆id
        brandName: '捷豹',
        seriesName: 'XK',
        modelName: '2012款 XKR-S 5.0L 硬顶版', // 品牌车型
        amount: 10.35, // 上架价格
        vin: 'LGXC76C34J00890000', // VIN
        spTime: '2021-02-15', // 初次上牌日期
        travelMileage: 10,
        spCityName: '北京市',
        imgZy:
          'https://ecar-test.oss-cn-shenzhen.aliyuncs.com/ecar/app/vehicleTravel/d7b3a0a7-2b29-43d4-9e18-6dfef2dc3e7b.jpg', // 行驶证图片
        vehicleNo: 'vehicleNo1', // 车牌号
        isUse: 1 // 使用性质 0-非营运,1-营运,2-营转非,3-租赁,4-教练
      },
      userInfo: {
        id: 148, // 用户id
        roleType: 0, // 角色类型：0普通用户 1经纪人 2车务
        name: '许芬勇', // 联系人
        mobile: '14718099417' // 联系方式(手机号)
      },
      detectionType: {
        101: '事故排查检测',
        102: '重要部件检测',
        103: '全面检测'
      },
      sellerInfo: {},

      shopping: {
        'buyerCreateAccountTime': '2021-12-08 15:29:02', // 买家创建存款账户完成时间
        'sellerCreateAccountTime': '2021-12-08 15:28:55', // 卖家创建存款账户完成时间
        'buyerSignTransactionContractTime': null, // 买方签订交易合同完成时间
        'sellerSignTransactionContractTime': null, // 卖方签订交易合同完成时间
        'sellerSignTransactionContractUrl': null, // 卖方签订交易合同链接
        'buyerPayBuyCarFeeConfirmTime': '', // 买方支付购车款确认完成时间
        'buyerRealNameAuthFinishedTime': null // 买方做活体实名认证-完成时间
      },
      deliveryInfo: {
        deliveryName: '', // 交付人
        deliveryMobile: '', // 交付人电话
        deliveryAddress: '', // 交车地址
        deliveryTime: '' // 交车时间,yyyy-MM-dd
      },
      vehicleAgent: {
        checkAgency: false, // 是否选择车务代办：true-是，false-否
        agencyStatus: null, // 车务代办状态
        vehicleAgentName: '', // 车务代办员
        vehicleAgentFee: null // 车务代办费用
      },
      ListByCarInfoId: [],
      ListByVehicleAssignedInfoIdType: [],
      ByVehicleOrderId: {},
      acceptanceCheckImage: [],
      SellerAcceptanceCheckImage: [],
      depositAccount: {

      },
      simpleBuyCarConfirm: {},
      simpleVehicleHandover: {},
      vehicleOrderPay: {}, // 购车订单支付信息
      sellViewUrl: '',
      buyViewUrl: '',
      buyAccount: {},
      sellAccount: {},
      imgSrc: ''

    }
  },
  mounted() {
    // const tokenInfo = { data: {
    //   userInfo: { token: '' }}}
    // tokenInfo.data.userInfo.token = 'bearer' + getToken()
    // localStorage.setItem('stores', JSON.stringify(tokenInfo))
  },
  created() {
    // 存款账户信息
    this.$get(`/web/zaccount/getDepositAccount?userId=${this.$route.query.userId}`).then(res => {
      if (res.data.code == 0) {
        this.buyAccount = res.data.data
        // console.log(this.buyAccount)
        this.$get(`/app/zaccount/updateZaccountAuth?userId=${this.$route.query.userId}`).then(res1 => {
          if (res1.code == 0) {
            if (res1.data.data.zauthState == 0) {
              this.shopping.buyerCreateAccountTime = ''
            } else if (res1.data.data.zauthState == 1) {
              this.shopping.buyerCreateAccountTime = res1.data.data.updateTime
            } else if (res1.data.data.zauthState == 2) {
              this.shopping.buyerCreateAccountTime = ''
              this.buyAccount.tips = '创建中'
            } else if (res1.data.data.zauthState == 3) {
              this.shopping.buyerCreateAccountTime = ''
              this.buyAccount.tips = '创建失败'
              this.buyAccount.remark = res1.data.data.remark
            }
          }
        })
      }
    })
    this.$get(`/web/zaccount/getDepositAccount?userId=${this.$route.query.sellId}`).then(res => {
      this.sellAccount = res.data.data
      this.$get(`/app/zaccount/updateZaccountAuth?userId=${this.$route.query.sellId}`).then(res2 => {
        if (res2.data.code == 0) {
          if (res2.data.data.zauthState == 0) {
            this.shopping.sellerCreateAccountTime = ''
          } else if (res2.data.data.zauthState == 1) {
            this.shopping.sellerCreateAccountTime = res2.data.data.updateTime
          } else if (res2.data.data.zauthState == 2) {
            this.shopping.sellerCreateAccountTime = ''
            this.sellAccount.tips = '创建中'
          } else if (res2.data.data.zauthState == 3) {
            this.shopping.sellerCreateAccountTime = ''
            this.sellAccount.tips = '创建失败'
            this.sellAccount.remark = res2.data.data.remark
          }
        }
      })
    })

    // 获取基础信息
    this.$get(
      `/web/vehicleOrder/get?id=${this.$route.query.id}`
    ).then((res) => {
      if (res.data.code === '0') {
        this.info = res.data.data
      } else {
        this.$message.error(res.data.message)
      }
    })
    // 2-获取车辆信息
    this.$get(
      `/web/vehicleOrder/getVehicleInfo?vehicleOrderId=${this.$route.query.id}`
    ).then((res) => {
      if (res.data.code === '0') {
        this.carInfo = res.data.data
      }
    })
    // 3-获取用户信息
    this.$get(
      `/web/vehicleOrder/getUserInfo?vehicleOrderId=${this.$route.query.id}&type=0`
    ).then((res) => {
      if (res.data.code === '0') {
        this.userInfo = res.data.data
      }
    })
    this.$get(
      `/web/vehicleOrder/getUserInfo?vehicleOrderId=${this.$route.query.id}&type=1`
    ).then((res) => {
      if (res.data.code === '0') {
        this.sellerInfo = res.data.data
      }
    })
    // 购车确认
    this.$get(`/web/vehicleOrder/getSimpleBuyCarConfirm?vehicleOrderId=${this.$route.query.id}`).then(res => {
      this.simpleBuyCarConfirm = res.data.data
      // /webye/vehicleOrderPay/get?id=2
      this.$get(`/web/vehicleOrderPay/get?id=${this.simpleBuyCarConfirm.payPlatformFeeOrderId}`).then(res => {
        if (res.data.code === '0') {
          this.vehicleOrderPay = res.data.data
        }
      })
    })

    // 购车签约
    this.$get(
      `/web/vehicleOrder/getSimpleBuyCarSignContract?vehicleOrderId=${this.$route.query.id}`
    ).then((res) => {
      if (res.data.code === '0') {
        this.shopping = res.data.data

        this.$post(`/web/fddSign/getFddSign`, {
          'vehicleOrderId': this.$route.query.id, // 车辆订单id
          'userId': this.$route.query.userId, // 买家用户id/卖家用户id
          'templateType': '103'
        }, 'json').then(res => {
          if (res.data.code === '0') {
            // console.log(res.data.data.viewUrl)
            this.buyViewUrl = res.data.data.viewUrl
            setTimeout(() => {
              this.shopping.buyerSignTransactionContractTime = res.data.data.endTime
            }, 100)
          }
        })
        this.$post(`/web/fddSign/getFddSign`, {
          'vehicleOrderId': this.$route.query.id, // 车辆订单id
          'userId': this.$route.query.sellId, // 买家用户id/卖家用户id
          'templateType': '103'
        }, 'json').then(res => {
          if (res.data.code === '0') {
            this.sellViewUrl = res.data.data.viewUrl
            setTimeout(() => {
              this.shopping.sellerSignTransactionContractTime = res.data.data.endTime
            }, 100)
          }
        })
      }
    })

    // 【简易购车】车辆交接（签收）
    this.$get(`/web/vehicleOrder/getSimpleVehicleHandover?vehicleOrderId=${this.$route.query.id}`).then(res => {
      if (res.data.code === '0') {
        this.simpleVehicleHandover = res.data.data
      }
    })

    // 8-存款账户信息
    this.$get(`/web/zaccount/getDepositAccount?userId=${this.$route.query.userId}`).then(res => {
      if (res.data.code === '0') {
        this.depositAccount = res.data.data
      }
    })
    // 【安心购车】交车信息
    this.$get(`/web/vehicleOrder/getDeliveryInfo?vehicleOrderId=${this.$route.query.id}`).then(res => {
      if (res.data.code == 0) {
        this.deliveryInfo = res.data.data
      }
    })
    this.$get(`/web/vehicleOrder/getAcceptanceCheckImage?vehicleOrderId=${this.$route.query.id}&type=0`).then(res => {
      if (res.data.data && res.data.code == 0) {
        this.imgSrc = res.data.data.imgSrc || ''
        // console.log(res.data.data)
      }
    })
  },
  methods: {
    open(url) {
      // console.log(url)
      if (url === null) return
      this.imgUrl = url
      this.imgDialogVisible = true
    },
    openUrl(url) {
      this.url = url
      this.dialogVisible = true
    },
    openUrls(tips) {
      const baseURl = process.env.NODE_ENV === 'production' ? 'https://ecarbroker.com.cn/ecarbokerh5/index.html#/' : 'https://test.ecarbroker.com.cn/ecarbokerh5/index.html#/'
      if (tips === '买方支付平台服务费用') {
        this.url = `${baseURl}orders/platformServices?carInfoId=` + this.info.carInfoId
        this.dialogVisible = true
      }
    }
  }
}
</script>

<style lang="scss" scoped>
@import "~@/styles/mixin.scss";
.content{
  display: flex;
  .box{
    display: flex;
   flex-direction: column;
   margin-right: 5px;

    // justify-content: ;
    img{
      width: 100px;
      height: 100px;
    }

  }
}
/deep/ .el-collapse-item__header {
  height: auto;
}
.arrow {
  color: #01bf8f;
}
.line {
  // border: 1px solid #f1f1f1;
  border-top:1px solid #f1f1f1;
  border-bottom: 1px solid #f1f1f1;

  display: flex;
  width: 100%;
  height: 50px;
  overflow: hidden;
  justify-content: space-between;
  > span {
    // line-height: 26px;
  }
  .left {
    display: inline-block;
    text-align: left;
    width: 230px;
    //  flex: 1;
  }
}
.container {
  .el-form-item {
    /deep/ .el-form-item__label {
      font-weight: 700 !important;
    }
  }
  width: 80%;
  margin: 0 auto;
  .title {
    position: relative;
    height: 80px;
    font-size: 24px;
    line-height: 80px;
    text-align: center;
    .btn {
      position: absolute;
      right: 0;
      top: 25px;
    }
  }
  label {
    width: 200px;
    padding-left: 20px;
    display: inline-block;
    text-align: left;
  }
  /deep/ .el-dialog__body {
    min-height: 100px;
    .scroll > iframe {
      @include scrollBar();
    }
  }
}
</style>

